<template>
  响应数据：{{user.name}}--{{user.age}}
  <br>
精简属性：
  响应数据：{{name}}--{{age}}
  <br>
  <button @click="changeName">更新数据</button>
</template>

<script>
import { reactive, toRefs } from 'vue'
export default {
  setup () {
    const user = reactive({
      name: 'LINING',
      age: 20
    })
    function changeName () {
      console.log(user);
      user.name += '+'
    }
    /**
     *  toRefs的作用
     *  简化复合数据类型取值，并保留响应式状态
     *  
     */
    const {name,age} =toRefs(user)
    return {
      user, changeName,name,age
    }
  }
}
</script>

<style>
</style>